<%@ page pageEncoding="UTF-8" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions" %>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
<c:set var="protocol" value="http://" />
<c:set var="dn" value="localhost:8080" />
<c:set var="ctx" value="${pageContext.request.contextPath}" />
<script type="text/javascript">
	window.protocol = '${protocol}';
	window.dn = '${dn}';
</script>
<!doctype html>
<html>
<head>
<title>jquery easyui 页面布局插件演示</title>
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8"/>
<link rel="stylesheet" href="${ctx}/css/global.css" />
<script type="text/javascript" src="${ctx}/js/jquery/jquery-1.7.2.min.js"></script>
<script type="text/javascript">
	window.ctx = '${ctx}';
</script>

<link rel="stylesheet" href="${ctx}/js/jquery/easyui/themes/default/easyui.css" />
<script type="text/javascript" src="${ctx}/js/jquery/easyui/jquery.easyui.min.js"></script>
</head>

<body class="easyui-layout">

	<div id="head" region="north" border="false" style="height:60px;background:#B3DFDA;">
		顶部系统
	</div>
	
	<div region="west" split="true" title="West" style="width:150px;padding:10px;">
		west content
	</div>
	<div region="east" split="true" title="East" style="width:100px;padding:10px;">east region</div>
	<div region="south" border="false" style="height:50px;background:#A9FACD;padding:10px;">south region</div>
	<div region="center" title="Main Title">
		
	</div>

<script type="text/javascript">
$(document).ready(function() {
	var p = $('body').layout('panel','west').panel({
		onCollapse:function(){
			alert('collapse');
		}
	});
	setTimeout(function(){
		$('body').layout('collapse','east');
	},0);
});
</script>
</body>
</html>
